<template>
  <view class="container">
    <view v-for="item in 4" :key="item" class="item" @tap="goLawClassDetail(item)">
      <view class="text">
        <text>法治非遗短剧场/传承有法...</text>
        <text>2023年01月20日</text>
      </view>
      <image src="" mode="scaleToFill" class="image" />
    </view>
  </view>
</template>

<script setup lang="ts">
import { ref, reactive, onMounted } from 'vue';
const goLawClassDetail = (item: any) => {
  uni.navigateTo({
    url: `/pages/index/lawClassDetail?id=${item}`,
  });
};
</script>

<style scoped lang="scss">
.item {
  display: flex;
  border-bottom: 1px solid #ccc;
  margin: 0 auto;
  width: 94%;
  .text {
    width: 100%;
    height: 100px;
    // background-color: red;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    margin-left: 40rpx;
    
  }

  .image {
    width: 200rpx;
    height: 200rpx;
  }
}
</style>